 <!-- 投诉列表页面 -->
 <template>
 	<view class="content">
 		<!-- 返回主页 -->
 		<view class="back" @click="back">
 			<view class="backicon"></view>
 		</view>
 		<view class="title">
 			<text>反馈与建议</text>
 		</view>
 		<!-- 投诉列表 -->
 		<view class="fun">
 			<view style="">
				<view v-if="indexList.length==0" style="margin-top: 500rpx;text-align: center;width: 100%;">
					<text style="color: white;font-size: 40rpx;font-weight: bold;">暂无举报哦~</text>
				</view>
 				<u-list height="1399rpx" @scrolltolower="scrolltolower"><!--  滑动到底部触发的事件-->
 					<u-list-item v-for="(item, index) in indexList" :key="index">
 						<view class="stu" @click="show=true,id=item.id,
 							name = item.sname,state = item.state,
 							stuclass = item.cname">
 							<view style="margin-top: 20rpx;
 								float: left; width: 100rpx;
 								height: 100rpx;border-radius: 20rpx; 
 								background-color: #aaaaff;
 								margin-left: 20rpx;">
 								<view class="tx"></view>
 							</view>
 							<view class="stuname1">
 								<text>{{item.sname}}</text>
 								<view style="font-size: 28rpx;text-overflow: ellipsis;
 									overflow: hidden;white-space: nowrap;width: 200rpx;">
 									<text>{{item.createTime}}</text>
 								</view>
 							</view>
 							<view v-if="item.readornot==4" style="margin-top: 20rpx;float: right; margin-right: 20rpx;color: #888888;"><!--  -->
 								<text>已读</text>
 							</view>
 						</view>
 					</u-list-item>
 				</u-list>
 			</view>
 		</view>
 		<!-- 弹窗看详情 -->
 		<u-popup :show="show" 
 			:round="20" mode="bottom" 
 			closeable
 			@close="close" @open="open">
 			<view style="height: 880rpx;">
 				<view class="name1">
 					<text style="margin-left: 20rpx; color: #555555;">上传人:</text>
 					<view style="margin-left: 110rpx;margin-top: -60rpx;
 						text-overflow: ellipsis;overflow: hidden;
 						white-space: nowrap;
 						width: 500rpx;"> 
 						<text style="margin-left: 20rpx;">{{name}}</text>
 					</view>
 				</view>
 				<view class="name1" v-if="state==0" style="margin-top: 20rpx;">
 					<view style="float: left;margin-right: 20rpx;">
 						<text style="margin-left: 20rpx; color: #555555;">班级:</text>
 						<text style="margin-left: 20rpx;">{{stuclass}}</text>
 					</view>
 				</view>
 				<view class="contenttext">
 					<view class="name2">
 						<text style="">内容:</text>
 					</view>
 					<view style="width: 630rpx; margin-left: 20rpx;margin-top: -10rpx;">
 						<u--textarea v-model="feedbackinfo.description" placeholder="请你详细描述问题, 不多于200个字" 
 							placeholderStyle="color: red;" 
 							disableDefaultPadding border="none" 
 							count showConfirmBar maxlength=200 
 							height="180" disabled></u--textarea>
 					</view>
 				</view>
 				<view style="margin-left: 20rpx; margin-top: 30rpx;" v-for=' item in imglist'>
 					<view class="img" >
 						<img :src="item"  style="border-radius: 25rpx; width: 200rpx;height: 200rpx;" @click="clickImg(item)">
 					</view>
 				</view>
 		        <u-popup :show="show1" mode="center" :round="20" zoom bgColor="transparent"
 					@close="closeimg" @open="openimg">
 						<view style="margin-top: 60rpx;width: 100%;">
 							<img :src="showimg" mode="aspectFit" style="border-radius: 30rpx;" >
 						</view>
 		                
 		            
 		        </u-popup>
 			</view>
 		</u-popup>
 		
 	</view>
 </template>
 
 <script>
 	import {
 		HNIT_URL
 	} from "@/constants/index.js";
	import col from "../../../../uni_modules/uview-ui/libs/config/props/col";
 	export default {
 		data() {
 			return {
 				description:"",
 				name: "匿名",
 				state: 0,// 匿名状态
 				show: false,
 				show1: false,
 				stuid:"",
 				stuname:"",
 				indexList: [],
 				feedbackinfo:[],
 				id:"",
 				stuclass:"",
 				imglist:[],
 				showimg:"",
 				page: 1,
 				readornot:3,
 			}
 		},
 		onShow() {
 			this.query()
 		},
 		onLoad() {},
 		methods: {
			// 点击查看大图
			clickImg(img){
				var imgUrl = img
				wx.previewImage({
					urls: [imgUrl],
					current: '',
					success: function(res) {},
					fail: function(res){},
					complete:function(res){}
				})
			},
 			query(){
 				// 发起请求
 				let params = {
 					page:this.page
 				}
 				this.$request.post(HNIT_URL + "wx/selectnamelist",params).then(res => {
 					this.indexList = this.indexList.concat(res)
 				})
 			},
 			scrolltolower(){
 				this.page = this.page + 1
 				let params = {
 					page:this.page
 				}
 				this.$request.post(HNIT_URL + "wx/selectnamelist",params).then(res => {
 					if(Object.keys(res).length == 0){
 						uni.showToast({
 							icon:"none",
 							title: "已经到底了"
 						})
 					}else{
 						this.indexList = this.indexList.concat(res)
 					}
 					
 				})
 			},
 			closeimg(){
 				this.show1 = false
 				this.showimg = ""
 			},
 			openimg(){
 			},
 			open() {
 				let item = this.indexList.find((item)=>{
 					return item.id == this.id;
 				});
 				item.readornot = 4
 				// 请求参数
 				let params = {
 					id:this.id,
 					readornot:item.readornot
 				}
 			    this.$request.post(HNIT_URL + "wx/feedbackinfo", params).then(res => {
 			    	this.feedbackinfo = res
 					let index = 0;
 					for(let i = 0; i<=2; i++){
 						var img = this.feedbackinfo.evidence.substring(index,index + this.feedbackinfo.evidence.indexOf(","));
 						index = index + img.length +1
 						img = img.replace(/\\/g,"\/");// 替换 \ => /
 						// this.imglist.push("../../../../uploadfile/" + img)
 						this.imglist.push( HNIT_URL + "uploadfile/" + img)// +
 					}
 			    })
 			},
 			close() {
 			    this.show = false
 				this.imglist = []
 			},
 			back() {
 				uni.reLaunch({
 					url: '/pages/manage/home/index'
 				});
 			},
 		}
 	}
 </script>
 
 <style>
 	@import url(index.css);
 	
 </style>
 